<template>
    <div>
        <vue-ueditor-wrap v-model="html" :config="ueConfig" mode="observer">
        </vue-ueditor-wrap>
    </div>
</template>

<script>
import $baseUrl from '@/utils/baseURL';
import "../../../public/UEditor/ueditor.config";
import "../../../public/UEditor/ueditor.all.min";
import "../../../public/UEditor/ueditor.parse.js";
import "../../../public/UEditor/lang/zh-cn/zh-cn.js";
import "../../../public/UEditor/themes/default/css/ueditor.css";
export default {
    name: 'UeditorTxt',
    props: ['content'],
    watch: {
        html(val) {
            this.$emit('text_content', val);
        },
    },
    data() {
        return {
            html: '',
            html_of: this.content || '',
            dialogVisible: false,
            imageList: [],
            ueConfig: {
                toolbars: [
                    [
                        'fullscreen',
                        'source',
                        '|',
                        'undo',
                        'redo',
                        '|',
                        'bold',
                        'italic',
                        'underline',
                        'fontborder',
                        'strikethrough',
                        'superscript',
                        'subscript',
                        'removeformat',
                        'formatmatch',
                        'autotypeset',
                        'blockquote',
                        'pasteplain',
                        '|',
                        'forecolor',
                        'backcolor',
                        'insertorderedlist',
                        'insertunorderedlist',
                        'selectall',
                        'cleardoc',
                        '|',
                        'rowspacingtop',
                        'rowspacingbottom',
                        'lineheight',
                        '|',
                        'customstyle',
                        'paragraph',
                        'fontfamily',
                        'fontsize',
                        //"|",
                        //"directionalityltr",
                        //"directionalityrtl",
                        //"indent",
                        '|',
                        'justifyleft',
                        'justifycenter',
                        'justifyright',
                        'justifyjustify',
                        '|',
                        //"touppercase",
                        //"tolowercase",
                        //"|",
                        'link',
                        'unlink',
                        //"anchor",
                        //"|",
                        'imagenone',
                        'imageleft',
                        'imageright',
                        'imagecenter',
                        '|',
                        // 'simpleupload',
                        'insertimage',
                        //"emotion",
                        //"scrawl",
                        "insertvideo",
                        //"music",
                        "attachment",
                        //"map",
                        //"gmap",
                        //"insertframe",
                        //"insertcode",
                        //"webapp",
                        'pagebreak',
                        //"template",
                        //"background",
                        '|',
                        'horizontal',
                        //"date",
                        //"time",
                        'spechars',
                        //"snapscreen",
                        //"wordimage",
                        '|',
                        'inserttable',
                        'deletetable',
                        'insertparagraphbeforetable',
                        'insertrow',
                        'deleterow',
                        'insertcol',
                        'deletecol',
                        'mergecells',
                        'mergeright',
                        'mergedown',
                        'splittocells',
                        'splittorows',
                        'splittocols',
                        //"charts",
                        //"|",
                        //"print",
                        //"preview",
                        //"searchreplace",
                        //"drafts",
                        //"help"
                    ],
                ],
                fontfamily: [
                    {
                        label: '',
                        name: 'songti',
                        val: '宋体,SimSun',
                    },
                    {
                        label: '仿宋',
                        name: 'fangsong',
                        val: '仿宋,FangSong',
                    },
                    {
                        label: '仿宋_GB2312',
                        name: 'fangsong',
                        val: '仿宋_GB2312,FangSong',
                    },
                    {
                        label: '',
                        name: 'kaiti',
                        val: '楷体,楷体_GB2312, SimKai',
                    },
                    {
                        label: '',
                        name: 'yahei',
                        val: '微软雅黑,Microsoft YaHei',
                    },
                    {
                        label: '',
                        name: 'heiti',
                        val: '黑体, SimHei',
                    },
                    {
                        label: '',
                        name: 'lishu',
                        val: '隶书, SimLi',
                    },
                    {
                        label: '',
                        name: 'andaleMono',
                        val: 'andale mono',
                    },
                    {
                        label: '',
                        name: 'arial',
                        val: 'arial, helvetica,sans-serif',
                    },
                    {
                        label: '',
                        name: 'arialBlack',
                        val: 'arial black,avant garde',
                    },
                    {
                        label: '',
                        name: 'comicSansMs',
                        val: 'comic sans ms',
                    },
                    {
                        label: '',
                        name: 'impact',
                        val: 'impact,chicago',
                    },
                    {
                        label: '',
                        name: 'timesNewRoman',
                        val: 'times new roman',
                    },
                ],
                // UEDITOR_HOME_URL: `/${$baseUrl.rootDirectory}/UEditor/`,
                // UEDITOR_CORS_URL: `/${$baseUrl.rootDirectory}/UEditor/`,
                UEDITOR_HOME_URL: `/UEditor/`,
                UEDITOR_CORS_URL: `/UEditor/`,
                autoHeightEnabled: false, // 编辑器不自动被内容撑高
                // 初始容器高度
                initialFrameHeight: 500,
                // 初始容器宽度
                initialFrameWidth: '100%',
                serverUrl: $baseUrl.fileServiceUrl + 'portalWebsite/files/upload',
                fileBasurl: $baseUrl.fileServiceUrl,
                // 上传文件接口
                imageActionName: 'uploadimage',
                imageAllowFiles: ['.png', '.jpg', '.jpeg', '.gif', '.bmp'],
                imageCompressBorder: 1600,
                imageCompressEnable: true,
                imageFieldName: 'file',
                imageInsertAlign: 'none',
                imageMaxSize: 20480000,
                imagePathFormat: '/ueditor/image/{yyyy}{mm}{dd}/{time}{rand:6}',
                imageUrlPrefix: '',
                /* 上传视频配置 */
                videoActionName: "uploadvideo", /* 执行上传视频的action名称 */
                videoFieldName: "file", /* 提交的视频表单名称 */
                "videoPathFormat": "upload/video/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
                "videoUrlPrefix": "", /* 视频访问路径前缀 */
                "videoMaxSize": 512000000, /* 上传大小限制，单位B，默认100MB 已修改成了512M*/
                "videoAllowFiles": [
                    ".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
                    ".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid"], /* 上传视频格式显示 */

                /* 上传文件配置 */
                "fileActionName": "uploadfile", /* controller里,执行上传视频的action名称 */
                "fileFieldName": "file", /* 提交的文件表单名称 */
                "filePathFormat": "upload/file/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
                "fileUrlPrefix": "", /* 文件访问路径前缀 */
                "fileMaxSize": 102400000, /* 上传大小限制，单位B，默认50MB 已修改成了1024M */
                "fileAllowFiles": [
                    ".png", ".jpg", ".jpeg", ".gif", ".bmp",
                    ".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
                    ".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid",
                    ".rar", ".zip", ".tar", ".gz", ".7z", ".bz2", ".cab", ".iso",
                    ".doc", ".docx", ".xls", ".xlsx", ".ppt", ".pptx", ".pdf", ".txt", ".md", ".xml"
                ], /* 上传文件格式显示 */
            },
        };
    },
    created() {
        if (this.html_of != '') {
            this.html = this.html_of;
        }
    },
    methods: {
        openModule(e) {
            this.html = e;
        },
    },
};
</script>

<style scoped></style>